<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>兆千图</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/news.css">
    <link rel="stylesheet" href="../../css/imgmodal.css">
</head>

<body>
    <div id="view" v-cloak>
        <div class="modal-bg" onclick="_close()">
            <div class="wrap" @click.stop>
                <header class="flex-c">
                    <div class="head-title flex-c">{{_i18n('视频')}}</div>
                </header>
                <ul class="img-ul video">
                    <li class="list" onclick="openCamera()">
                        <div class="flex-c" style="height: 100%;background: #f3f3f3;border-radius: 5px;">
                            <img style="width: 35px;height: 35px;" src="../../image/icon/camera.png" alt="">
                        </div>
                    </li>
                    <li class="list" v-for="(m, index) in ffList" @click="selectVideo(m)">
                        <img :src="m.thumbPath" alt="">
                        <span class="time">{{returnTime(m.duration)}}</span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/jquery.js"></script>
<script src="../../script/ffkj.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/photo.js"></script>
<script>
    var view = new Vue({
        el: '#view',
        data: {
            imgurl: imgurl,
            ffList: [],
            ffInfo: {},
            ios: 1, // 1上架 0非上架
            num: 0,
            max: 10,
            total: 0,
            sroll: 0,
        },
        methods: {
            selectVideo(data) {
                selectVideo(data);
            },
            returnTime(t) {
                var time = Math.ceil(t / 1000);
                var mm = Math.floor(time / 60);
                mm = mm < 10 ? '0' + mm : mm;
                var ss = time % 60;
                ss = ss < 10 ? '0' + ss : ss;
                return mm + ':' + ss;
            },
            // 跳转
            _url(param, url) {
                _url(param, url);
            },
            // 返回图片路径
            returnImg(url) {
                return returnImg(url);
            },
        }
    })
    var uiimg;
    apiready = function() {
        uiimg = new UIIMG();
        uiimg.open(function(ret) {
            view.total = ret.total;
            for (var i = 0, len = ret.list.length; i < len; i++) {
                ret.list[i].num = 0;
            }
            view.ffList = ret.list;
        }, 'video')
        var dom = '.img-ul';
        $(dom).on('scroll', function(e) {
            var st = $(dom).scrollTop();
            var h = $(dom).height();
            var sh = $(dom)[0].scrollHeight;
            if (view.sroll == 1) return;
            if (st >= (sh - h - 10)) {
                console.log('滚动')
                if (view.total == view.ffList.length) {
                    console.log('全部加载完毕')
                    return;
                }
                view.sroll = 1;
                uiimg.next(function(ret) {
                    for (var i = 0, len = ret.list.length; i < len; i++) {
                        ret.list[i].num = 0;
                    }
                    view.ffList = view.ffList.concat(ret.list);
                    view.sroll = 0
                })
            }
        })
    }

    // 关闭
    function _close() {
        api.closeFrame();
    }

    // 相机
    function openCamera() {
        openPicUrl(function(result) {
            getVideoCover(result.data, function(cover) {
                var obj = {
                    path: result.data,
                    cover: cover,
                }
                submitVideo(obj)
            })
        }, 1, 'video')
    }

    function selectVideo(data) {
        var obj = {
            path: data.path,
            cover: data.thumbPath,
        }
        if (api.systemType == 'ios') {
            uiimg.transVideo(data.path, function(path) {
                obj.path = path;
                submitVideo(obj);
            })
        } else {
            submitVideo(obj)
        }
    }

    // 
    function submitVideo(data) {
        var e = api.pageParam['event'];
        if (e) {
            _send(e, {
                video: {
                    path: data.path,
                    cover: data.cover,
                }
            })
            setTimeout(function() {
                _close();
            }, 500)
        }
    }
</script>

</html>